<!-- 工作任务详情 -->
<template>
	<view class="bizPage" :style="mainStore.themeColor">
		<status-bar title="任务详情" />
		<view class="padding20" v-if="pageData">
			<view class="card">
				<view class="item">
					<view class="label">任务名称：</view>
					<view class="value">{{ pageData.taskName }}</view>
				</view>
				<view class="item">
					<view class="label">任务开始时间：</view>
					<view class="value">{{ pageData.startTime }}</view>
				</view>
				<view class="item">
					<view class="label">任务截止时间：</view>
					<view class="value">{{ pageData.endTime }}</view>
				</view>
				<view class="item" v-if="pageData.taskDesc">
					<view class="label">任务描述：</view>
					<view class="value">{{ pageData.taskDesc }}</view>
				</view>
				<view class="item" v-if="fileUrl || (pageData.userId == mainStore.userInfo.userId && (status == 0 || status == 2))">
					<choose-file class="width" :rawFile="fileUrl" :readonly="!(pageData.userId == mainStore.userInfo.userId && (status == 0 || status == 2))" @getFile="getFile" />
				</view>
				<view class="item" v-if="pageData.finishTime">
					<view class="label">完成时间：</view>
					<view class="value">{{ pageData.finishTime }}</view>
				</view>
				<view class="item" v-if="status == 1 || status == 2">
					<view class="label">完成情况：</view>
					<view class="value">{{ status == 1 ? '已完成' : '未完成' }}</view>
				</view>
				<view class="item" v-if="pageData.auditContent">
					<view class="label">未完成原因：</view>
					<view class="value">{{ pageData.auditContent }}</view>
				</view>
				<view class="item" v-if="pageData.score > 0">
					<view class="label">评分：</view>
					<view class="value">{{ pageData.score }}分</view>
				</view>
			</view>
		</view>
		
		<!-- 执行人 -->
		<view class="d-flex j-se m-top40" v-if="pageData.userId == mainStore.userInfo.userId && (status == 0 || status == 2)">
			<view class="btn flexac plain" @click="toUrl('/bizPage/task/selectList?title=转交')">转交</view>
			<view class="btn flexac themeBg white" @click="handleSubmit">提交</view>
		</view>
		
		<!-- 审批人 -->
		<view class="d-flex j-se m-top40" v-if="pageData.currentReviewerUserId == mainStore.userInfo.userId && status == 4">
			<view class="btn flexac fail" @click="handleAudit('0')">不通过</view>
			<view class="btn flexac themeBg white" @click="handleAudit('1')">通过</view>
		</view>
		
		<up-popup :show="showPopup" :round="10" closeable @close="showPopup = false">
			<view class="botPop">
				<block v-if="examine == 0">
					<view class="size32 bold text-center m-bot30">审核不通过</view>
					<up-textarea v-model="auditContent" placeholder="请输入审核不通过原因" height="154"></up-textarea>
				</block>
				<block v-if="examine == 1">
					<view class="size32 bold text-center m-bot70">评分：{{ score }}分</view>
					<view class="p-left40 p-right40">
						<view class="star" v-for="(item,index) in 10" :key="index">
							<image :src="staticImg + (score > index ? 'star-fill.png' : 'star.png')" mode="aspectFill" class="icon" @click="score = index + 1"></image>
						</view>
					</view>
				</block>
				<view class="Btn flexac themeBg size30 white m-top60" @click="confirm">确认</view>
			</view>
		</up-popup>
	</view>
</template>

<script setup>
	import { ref } from 'vue'
	import { onLoad, onShow } from '@dcloudio/uni-app'
	import { useMainStore } from '@/stores/index'
	import { staticImg } from '@/utils/config.js'
	import { toUrl, Toast, Modal } from '@/utils/utils.js'
	import Http from '@/utils/request.js'
	import statusBar from '../components/statusBar.vue'
	import chooseFile from '../components/chooseFile.vue'
	
	const mainStore = useMainStore()
	const id = ref('')
	const pageData = ref('')
	const status = ref('') // 0新建任务、1已完成、2未完成、4已提交待审核
	const fileUrl = ref('')
	
	onLoad((e) => {
		if(e.id) id.value = e.id
		getInfo()
	})
	
	onShow(() => {
		// 获取转交人的userId
		let userId = uni.getStorageSync('targetUserId')
		if(userId) {
			transferTask(userId)
			uni.removeStorageSync('targetUserId')
		}
	})
	
	const getInfo = () => {
		Http.get({
			url: '/hr/task/WorkTaskDetail',
			data: {
				id: id.value
			}
		}).then(res => {
			if(res.code != 0) return Toast(res.msg)
			let result = res.data || ''
			pageData.value = result
			status.value = result.status
			fileUrl.value = result.fileUrl
		})
	}
	
	// 提交
	const getFile = ({file}) => {
		fileUrl.value = file
	}
	const handleSubmit = () => {
		Http.post({
			url: '/hr/task/submitTask',
			data: {
				taskId: pageData.value.id,
				fileUrl: fileUrl.value
			}
		}).then(res => {
			Toast(res.msg)
			if(res.code == 0) getInfo()
		})
	}
	
	// 转交
	const transferTask = (userId) => {
		Http.post({
			url: '/hr/task/workTransferTask',
			data: {
				userId,
				taskId: pageData.value.id,
				fileUrl: fileUrl.value
			}
		}).then(res => {
			Toast(res.msg)
			if(res.code == 0) getInfo()
		})
	}
	
	// 审核
	const examine = ref('') // 0不通过、1通过
	const auditContent = ref('')
	const score = ref(1)
	const showPopup = ref(false)
	
	const handleAudit = async (val) => {
		examine.value = val
		if(examine.value == 1 && pageData.value.scoreUserId != mainStore.userInfo.userId) {
			let result = await Modal('确定通过吗？')
			if(result) confirm()
			return 
		}
		showPopup.value = true
	}
	
	const confirm = () => {
		let params = {
			taskId: pageData.value.id,
			currentReviewerUserId: pageData.value.currentReviewerUserId,
			examine: examine.value
		}
		if(examine.value == 0) params.auditContent = auditContent.value
		if(examine.value == 1 && pageData.value.scoreUserId == mainStore.userInfo.userId) params.score = score.value
		Http.post({
			url: '/hr/task/taskreview',
			data: params
		}).then(res => {
			Toast(res.msg)
			if(res.code != 0) return
			getInfo()
			showPopup.value = false
		})
	}
</script>

<style lang="scss" scoped>
	.bizPage {
		min-height: 100vh;
		background: #F9F9F9;
	}
	.card {
		background: #FFFFFF;
		border-radius: 20rpx;
		padding: 0 20rpx;
		.item {
			display: flex;
			padding: 30rpx 0;
			&:not(:last-child) {
				border-bottom: 1rpx solid #F2F2F2;
			}
			.label {
				font-size: 28rpx;
				color: #222;
			}
			.value {
				flex: 1;
				text-align: right;
				font-size: 28rpx;
			}
		}
	}
	.btn {
		width: 200rpx;
		height: 60rpx;
		border-radius: 10rpx;
		font-size: 28rpx;
		&.plain {
			border: 1rpx solid v-bind('mainStore.color');
			color: v-bind('mainStore.color');
		}
		&.fail {
			border: 1rpx solid #E60012;
			color: #E60012;
		}
	}
	.botPop {
		padding: 40rpx 30rpx;
		.star {
			display: inline-block;
			width: 20%;
			text-align: center;
			margin-bottom: 26rpx;
			.icon {
				width: 76rpx;
				height: 74rpx;
			}
		}
		.Btn {
			height: 96rpx;
			border-radius: 12rpx;
		}
	}
</style>
